import React, {Component} from "react";
import Welcome from './welcome/Welcome';
import Clock from './clock/Clock';
import Button from './button/Button';
import NumberList from './list/NumberList';

class Basic extends Component {
  constructor (props) {
    super(props);
    this.state = {
      numbers: [1, 3, 5]
    }
  }

  render () {
    return (
      <div>
        <Welcome name='Monkey'/>
        <Welcome name='Lucy'/>
        <Clock/>
        <Button text='增加' onClick={this.handleClick.bind(this)}/>
        <NumberList numbers={this.state.numbers}/>
      </div>
    )
  }

  handleClick (text) {
    this.setState((prevState) => {
      const numbers = prevState.numbers;
      numbers.push(text);
      return {
        numbers: numbers
      }
    });
  }
}

export default Basic;